<template>
   <div class="setconfirm">
      <wxc-minibar class="border-bottom" title="设置">
             <!-- <div class="header-con" slot="middle">
                <text class="header-title">设置</text>
            </div> -->
      </wxc-minibar>

      <div class="option" @click="gopasswordconfig">
         <div class="option_fl">
           <text style="font-family: PingFangSC-Medium;font-size: 32px;color: #333333;">交易密码</text>
         </div>
         <div class="option_fr">
           <text style="font-size: 28px;color: #666666;margin-right:48px;">{{title}}</text>
           <image style="width:28px;height:26px;" src="http://zhongcai-test.oss-cn-beijing.aliyuncs.com/hch5/more.png"></image>
         </div>
      </div>
       <div class="option" @click="goabout">
         <div class="option_fl">
           <text style="font-family: PingFangSC-Medium;font-size: 32px;color: #333333;">关于我们</text>
         </div>
         <div class="option_fr">
           <text style="font-size: 28px;color: #666666;margin-right:48px;"></text>
           <image style="width:28px;height:26px;" src="http://zhongcai-test.oss-cn-beijing.aliyuncs.com/hch5/more.png"></image>
         </div>
      </div>
       <div class="option" @click="gopasswordconfig">
         <div class="option_fl">
           <text style="font-family: PingFangSC-Medium;font-size: 32px;color: #333333;">版本更新</text>
         </div>
         <div class="option_fr">
           <text style="font-size: 28px;color: #666666;margin-right:0px;">V1.0.0</text>
         </div>
      </div>
      <div class="button_box">
         <div class="button" @click="exit">
           <text style="font-family: PingFangSC-Medium;font-size: 32px;color:#FA645E;">退出登录</text>
         </div>
      </div>
   </div>
</template>

<script>
  import { getBaseUrl }  from "@/utils/index.js"
  import WxcMinibar from "@/components/modules/wxc-minibar/index.js"
  var sxglobalEvent = weex.requireModule("globalEvent");
  let storage = weex.requireModule("storage");
  let navigator = weex.requireModule('navigator')
  const modal = weex.requireModule('modal')
  const myAccount = new BroadcastChannel('app')
  export default {
	data() {
		return {
		title: "",
		baseURL:''
		};
	},
	
	components:{
		WxcMinibar
	},

	created() {
		this.baseURL = getBaseUrl(weex.config.bundleUrl, true)
		this.getCache()
	},

	methods: {
		exit() {
			storage.removeItem("token", event => {
				navigator.push({
					'url': this.baseURL + 'views/login/login.js',
					'animated': 'true'
				})
			})
		},

		// 获取缓存指定数据
		getItem (name) {
			return new Promise((resolve, reject)=>{
				storage.getItem(name, event => {
					if (event.result === "success") {
						resolve(event.data);
					} else {
						reject('获取定位失败')
					}
				})
			})
		},
			
		getCache() {
			this.getItem('personalDetails').then( (value) => {
        let { hasPayPassword } = JSON.parse(value)
        
				this.title = hasPayPassword == 0 ? "未设置" : "可修改"
			})
		},
			
		gopasswordconfig() {
			if (this.title === "可修改") {
				navigator.push({
					'url': this.baseURL + 'views/my-account/update-password.js',
					'animated': 'true'
				})

			} else if (this.title === "未设置") {
				navigator.push({
					'url': this.baseURL + 'views/my-account/set-password.js',
					'animated': 'true'
				})
			
			}
    },
    goabout(){
      	navigator.push({
					'url': this.baseURL + 'views/about-us/about-us.js',
					'animated': 'true'
				})
    }
	}
};
</script>
<style scoped>
.setconfirm {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#f5f5f5;
}
.header {
  width: 750px;
  height: 90px;
  background-color: #fff;
  box-shadow: 0 4px 15px 0 rgba(229, 229, 229, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.header-img {
  position: absolute;
  left: 32px;
  top: 34px;
  margin-left: 0;
}

.header-title {
  font-size: 34px;
  color: #fff;
  font-family: PingFangSC-Medium;
}
.header-img-right {
  position: absolute;
  right: 32px;
  top: 34px;
  margin-left: 0;
}
.option {
  height: 112px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding-left: 31px;
  padding-right: 33px;
  background-color: #ffffff;
}
.option_fr {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.button_box {
  margin-top: 112px;
 
}
.button {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 112px;
  background-color: #e70d0d;
  border-radius: 4px;
  background-color: #fff;
}

.header-con {
	flex:1;
	height: 90px;
	display: flex;
	justify-content: center;
	position: relative;
	align-items: center;
	flex-direction: row;
}

.header-title {
  font-family: PingFangSC-Medium;
  font-size: 34px;
  color: #fff;
}


.border-bottom{
  border-bottom-color: #f1f1f1;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
</style>